<template>
  <div>
    <div v-for="item in goodsList" :key="item.id">
      <p>商品名字：{{ item.goodsName }}</p>
      <p>商品价格：{{ item.goodsPrice }}</p>
      <p>上架时间：{{ item.addTime }}</p>
      <button @click="addCart(item)">加入购物车</button>
      <hr />
    </div>
  </div>
</template>

<script>
import { mapState } from "vuex";
import moment from "moment";
export default {
  name: "GoodsList",
  methods: {
    // 加入购物车
    addCart(item) {
        // 收集数据
        this.$store.commit("ADD_CART" , item)
    },
  },
  computed: {
    // 目前不行
    // ...mapState(["goodsList"])

    // 简写：
    ...mapState({
      goodsList(state) {
        return state.goods.goodsList;
      },
    }),
  },
  mounted() {
    // 非简写
    // console.log(this.$store.state.goods.goodsList)
    // 简写：
    // console.log(this.goodsList)
  },
};
</script>

<style scoped></style>
